<template>
	<view>
		<view v-if="orderList != ''" class="main p30">
			<view class="list ">
				<view class="lists p30" v-for="(item,index) in orderList" :key="index" @click="toDetail(item.id)">
					<view class="title ">
						<image class="logo vm" :src="item.productCreator.eperAccount.eperAvatarImg" mode=""></image>
						{{item.productCreator.eperAccount.eperUsername}}
						<view class="fr c2" v-if="item.status == 'RESERVED'">已预定</view>
						<view class="fr c2" v-if="item.status == 'ORDER_TAKING'">摊主已接单</view>
						<view class="fr c2" v-if="item.status == 'DELIVERY'">摊主送货中</view>
						<view class="fr c2" v-if="item.status == 'COMPLETED'">已完成</view>
						<view class="fr c2" v-if="item.status == 'CANCELLED'">交易取消</view>
						<view class="fr c2" v-if="item.status == 'SELF_PICK_UP'">等待自取</view>
					</view>
					<view class="main ">
						<view class="box " v-for="(cItem,cIndex) in item.orderItems" :key="cIndex">
							<image class="shop" :src="cItem.image" mode="aspectFit"></image>
							<view class="txt">
								<p class="p1  one">
									{{cItem.name}}
								</p>
								<p class="p2 text-xs one">
									收藏 {{cItem.productInfo.favoriteQuantity}}
									&nbsp;&nbsp;
									已购 {{cItem.productInfo.sales}}
								</p>
								<p class="p3 text-lg one"><text style="font-size: 24rpx;">¥</text> {{cItem.price}} <span style="font-size: 24rpx;">× {{cItem.quantity}}</span></p>
							</view>
						</view>
						<view class="bottom ">
							<p >共{{item.orderItems.length}}件商品   合计：  ¥<span class="sum"> {{item.price}}</span> </p>
							<p class="btns" v-if=" item.status != 'CANCELLED'"> 
								<u-button :ripple="true" shape="circle" class="remves"
									v-if="item.status == 'RESERVED' || item.status == 'ORDER_TAKING' || item.status == 'SELF_PICK_UP'" 
									@click="updateStatus(item.id,'CANCELLED')"
								>取消预定</u-button>
								<u-button :ripple="true" shape="circle" :plain="true" type="success" class="remves"
									v-if="item.status == 'DELIVERY' || item.status == 'SELF_PICK_UP'"
									@click="updateStatus(item.id,'COMPLETED')"
								>确认收货</u-button>
								  <u-button :ripple="true" shape="circle" :plain="true" type="success" class="remves"
								  	v-if="item.status == 'DELIVERED'"
								  	@click="goCommon(item)"
								  >前往评价</u-button> 
							</p> 
						</view>
					</view>
				</view>
				<uni-load-more :contentText="loadText" :status="loadStatus"></uni-load-more>
			</view>
		</view>
		<view v-if="orderList == '' " class=" dataNone">
			<image src="../../static/image/dinghdan@2x.png" mode=""></image>
			<p>暂无订单</p>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				state:'',
				pageNumber: 0,
				pageSize: 10,
				orderList: [], 
				loadStatus: 'noMore',
				loadText: {
					contentdown: "上拉显示更多",
					contentrefresh: "正在加载...",
					contentnomore: "没有更多数据了"
				}
			}
		},
		onLoad(e) {
			if(e.state){
				this.state = e.state
				let title = ''
				if(e.state =='RESERVED'){
					title ='我预定的'
				}
				if(e.state =='DELIVERED'){
					title ='待评价的'
				}
				uni.setNavigationBarTitle({
					title:title
				})
			} 
		},
		onShow() {
			this.pageNumber = 0;
			this.orderList = [];
			this.getList();
		},
		methods: {
			goCommon(item){  
				uni.setStorageSync('CreateComment',item)
				uni.redirectTo({
					url:'../CreateComment/CreateComment'
				})
			},
			getList() {
				this.loadStatus = 'loading';
				var params = {
					isCreator: true
				};
				params.pageable = {
					pageNumber: ++this.pageNumber,
					pageSize: this.pageSize
				};
				if(this.state){
					params.status = this.state
				}
				this.$common.ajax.postAjax({
					url: this.$common.url.api.orderList,
					data: params,
					success: res => {
						var result = res.data;
						if (result.code == 0) {
							this.orderList = this.orderList.concat(result.data.content);
						} else {
							this.$common.msg(result.msg);
						}
						if (this.pageNumber == result.data.totalPages || result.data.totalPages == 0) {
							this.loadStatus = 'noMore';
						} else {
							this.loadStatus = 'more';
						}
					},
					fail: e => {
						this.$common.msg("网络不佳~~")
					}
				})
			},
			updateStatus(id, status) {
				var params = {
					id: id,
					status: status
				}
				this.$common.ajax.postAjax({
					url: this.$common.url.api.memberUpdateStatus,
					data: params,
					success: res => {
						var result = res.data;
						if (result.code == 0) {
							this.pageNumber = 0;
							this.orderList = [];
							this.getList();
						} else {
							this.$common.msg(result.msg);
						}
					},
					fail: e => {
						this.$common.msg("网络不佳~~")
					}
				})
			},
			toDetail(id) {
				var url = `../OrderDetails/OrderDetails?id=${id}`;
				this.$common.navigateTo(url);
			}
		},
		onReachBottom() {
			if (this.loadStatus == 'more') {
				this.getList();
			}
		}
	}
</script>

<style lang="less" scoped>
	@import '../../static/initLess/BuyPublic.less';
</style>
